<!DOCTYPE html>
<html lang="en">
<head>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css" integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous">
    <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ho+j7jyWK8fNQe+A12Hb8AhRq26LrZ/JpcUGGOn+Y7RsweNrtN/tE3MoK7ZeZDyx" crossorigin="anonymous"></script>
    <!-- 导入外部相关内容css以及js -->
    <link rel="stylesheet" href="./css/invest.css">
    <script src="./js/invest.js"></script>
    <link rel="stylesheet" href="./css/top_nav.css">
        <link rel="stylesheet" href="./css/car_bottom.css">
<meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>充值</title>

    <script>
      // 固定logo、搜索框、购物车
      $(function () {
          $(window).scroll(function () {
              var t = $(document).scrollTop();
              document.title = t;
              if (t > 80) {
                  $('#top').addClass('fixx');
              } else {
                  $('#top').removeClass('fixx');
              }
          })
      })
      // 侧方导航栏控制不同div显示
      function show2() {
          document.getElementById("box002").style.display = "block";
          document.getElementById("box003").style.display = "none";
          document.getElementById("box004").style.display = "none";
          document.getElementById("box005").style.display = "none";
          document.getElementById("box006").style.display = "none";
          document.getElementById("box007").style.display = "none";
          document.getElementById("box008").style.display = "none";
          document.getElementById("box009").style.display = "none";
          document.getElementById("box010").style.display = "none";
      };
      function show3() {
          document.getElementById("box002").style.display = "none";
          document.getElementById("box003").style.display = "block";
          document.getElementById("box004").style.display = "none";
          document.getElementById("box005").style.display = "none";
          document.getElementById("box006").style.display = "none";
          document.getElementById("box007").style.display = "none";
          document.getElementById("box008").style.display = "none";
          document.getElementById("box009").style.display = "none";
          document.getElementById("box010").style.display = "none";
      };
      function show4() {
          document.getElementById("box002").style.display = "none";
          document.getElementById("box003").style.display = "none";
          document.getElementById("box004").style.display = "block";
          document.getElementById("box005").style.display = "none";
          document.getElementById("box006").style.display = "none";
          document.getElementById("box007").style.display = "none";
          document.getElementById("box008").style.display = "none";
          document.getElementById("box009").style.display = "none";
          document.getElementById("box010").style.display = "none";
      };
      function show5() {
          document.getElementById("box002").style.display = "none";
          document.getElementById("box003").style.display = "none";
          document.getElementById("box004").style.display = "none";
          document.getElementById("box005").style.display = "block";
          document.getElementById("box006").style.display = "none";
          document.getElementById("box007").style.display = "none";
          document.getElementById("box008").style.display = "none";
          document.getElementById("box009").style.display = "none";
          document.getElementById("box010").style.display = "none";
      };
      function show6() {
          document.getElementById("box002").style.display = "none";
          document.getElementById("box003").style.display = "none";
          document.getElementById("box004").style.display = "none";
          document.getElementById("box005").style.display = "none";
          document.getElementById("box006").style.display = "block";
          document.getElementById("box007").style.display = "none";
          document.getElementById("box008").style.display = "none";
          document.getElementById("box009").style.display = "none";
          document.getElementById("box010").style.display = "none";
      };
      function show7() {
          document.getElementById("box002").style.display = "none";
          document.getElementById("box003").style.display = "none";
          document.getElementById("box004").style.display = "none";
          document.getElementById("box005").style.display = "none";
          document.getElementById("box006").style.display = "none";
          document.getElementById("box007").style.display = "block";
          document.getElementById("box008").style.display = "none";
          document.getElementById("box009").style.display = "none";
          document.getElementById("box010").style.display = "none";
      };
      function show8() {
          document.getElementById("box002").style.display = "none";
          document.getElementById("box003").style.display = "none";
          document.getElementById("box004").style.display = "none";
          document.getElementById("box005").style.display = "none";
          document.getElementById("box006").style.display = "none";
          document.getElementById("box007").style.display = "none";
          document.getElementById("box008").style.display = "block";
          document.getElementById("box009").style.display = "none";
          document.getElementById("box010").style.display = "none";
      };
      function show9() {
          document.getElementById("box002").style.display = "none";
          document.getElementById("box003").style.display = "none";
          document.getElementById("box004").style.display = "none";
          document.getElementById("box005").style.display = "none";
          document.getElementById("box006").style.display = "none";
          document.getElementById("box007").style.display = "none";
          document.getElementById("box008").style.display = "none";
          document.getElementById("box009").style.display = "block";
          document.getElementById("box010").style.display = "none";
      };
      function show10() {
          document.getElementById("box002").style.display = "none";
          document.getElementById("box003").style.display = "none";
          document.getElementById("box004").style.display = "none";
          document.getElementById("box005").style.display = "none";
          document.getElementById("box006").style.display = "none";
          document.getElementById("box007").style.display = "none";
          document.getElementById("box008").style.display = "none";
          document.getElementById("box009").style.display = "none";
          document.getElementById("box010").style.display = "block";
      };
      function hiden2() { document.getElementById("box002").style.display = "none"; };
      function hiden3() { document.getElementById("box003").style.display = "none"; };
      function hiden4() { document.getElementById("box004").style.display = "none"; };
      function hiden5() { document.getElementById("box005").style.display = "none"; };
      function hiden6() { document.getElementById("box006").style.display = "none"; };
      function hiden7() { document.getElementById("box007").style.display = "none"; };
      function hiden8() { document.getElementById("box008").style.display = "none"; };
      function hiden9() { document.getElementById("box009").style.display = "none"; };
      function hiden10() { document.getElementById("box010").style.display = "none"; };
  </script>
</head>
<body>
<!-- 头部 -->
<!-- 顶部图片 -->
<img src="./img/top1.png" style="width: 100%;">
<!-- 黑色导航栏 -->
<div class="nav_black">
    <div style="width: 80%; margin: 0 auto;">
        <div style="float: left; width: 30%;">
            <nav id="nav_list" class="nav">
                <a class="nav-link" href="#">考拉欢迎你！</a>
                <a class="nav-link" href="login.html">登录</a>
                <a class="nav-link" href="#">免费注册</a>
                <a class="nav-link" data-toggle="popover" data-placement="bottom" href="#">手机考拉</a>
            </nav>
        </div>
        <div style="float: right; width: 70%;">
            <ul id="nav_sec" class="nav justify-content-end">
                <li class="nav-item">
                    <a class="nav-link active" href="#">每日签到</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="#">我的订单</a>
                </li>
                <li id="nav_sec" class="nav-item dropdown">
                    <a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button"
                        aria-haspopup="true" aria-expanded="false">个人中心</a>
                    <div class="dropdown-menu">
                        <a class="dropdown-item" href="#">我的优惠券</a>
                        <a class="dropdown-item" href="#">我的红包</a>
                        <a class="dropdown-item" href="kaolabean.html">我的考拉豆</a>
                        <div class="dropdown-divider"></div>
                        <a class="dropdown-item" href="#">账号管理</a>
                        <a class="dropdown-item" href="#">我的实名认证</a>
                        <a class="dropdown-item" href="shoppingaddress.html">我的收货地址</a>
                        <div class="dropdown-divider"></div>
                        <a class="dropdown-item" href="#">我收藏的商品</a>
                        <a class="dropdown-item" href="#">我关注的品牌</a>
                        <div class="dropdown-divider"></div>
                        <a class="dropdown-item" href="#">售后管理</a>
                    </div>
                </li>
                <li class="nav-item dropdown">
                    <a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button"
                        aria-haspopup="true" aria-expanded="false">客户服务</a>
                    <div class="dropdown-menu">
                        <a class="dropdown-item" href="#">联系客服</a>
                        <a class="dropdown-item" href="#">帮助中心</a>
                        <a class="dropdown-item" href="#">知识产权保护</a>
                        <a class="dropdown-item" href="#">规则中心</a>
                    </div>
                </li>
                <li class="nav-item dropdown">
                    <a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button"
                        aria-haspopup="true" aria-expanded="false">充值中心</a>
                    <div class="dropdown-menu">
                        <a class="dropdown-item" href="#">话费充值</a>
                        <a class="dropdown-item" href="#">游戏充值</a>
                        <a class="dropdown-item" href="#">AppStore充值卡</a>
                    </div>
                </li>
                <li class="nav-item dropdown">
                    <a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button"
                        aria-haspopup="true" aria-expanded="false">消费者权益</a>
                    <div class="dropdown-menu">
                        <a class="dropdown-item" href="consumer.html">消费者告知书</a>
                    </div>
                </li>
                <li class="nav-item dropdown">
                    <a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button"
                        aria-haspopup="true" aria-expanded="false">更多</a>
                    <div class="dropdown-menu">
                        <a class="dropdown-item" href="#">收藏本站</a>
                        <div class="dropdown-divider"></div>
                        <a class="dropdown-item" href="#">新浪微博</a>
                        <a class="dropdown-item" href="#">微信公众号</a>
                        <a class="dropdown-item" href="#">招商合作</a>
                    </div>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="#">视频内容</a>
                </li>
            </ul>
        </div>
    </div>
</div>
<!-- 网易考拉logo、搜索框、购物车按钮 -->
<div id="top" class="component_thr" style="width: 100%; height: 100px;display: flex;">
    <!-- logo -->
    <div style="text-align: right; position: relative;right: 20px;">
        <img style="height: 100%;" src="./img/wykl_logo.png">
    </div>
    <!-- 搜索框 -->
    <div style="height: 100%;">
        <div id="search" class="input-group mb-3">
            <input type="text" class="form-control" placeholder="面膜" aria-label="面膜"
                aria-describedby="button-addon2">
            <div class="input-group-append">
                <button id="btn1" class="btn btn-outline-secondary" type="button" id="button-addon2"><img
                        style="height: 20px;" src="img/top_search.png"></button>
            </div>
        </div>
    </div>
    <!-- 购物车按钮 -->
    <div>
        <button id="btn2" onclick="window.location.href='car.html'"><img style="margin: 10px; height: 20px;"
                src="img/shop_car1.png">购物车&nbsp;&nbsp;&nbsp;</button>
    </div>
</div>
<!-- 二级导航栏 -->
<div style="margin-top:0px; border-bottom: 1px solid rgb(179, 179, 179);">
    <div style="width: 70%; margin: 0 auto; text-align: left;">
        <div class="dropdown">
            <a class="btn btn-secondary dropdown-toggle" id="dropdown_s" href="#" role="button"
                id="dropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"
                style="position: relative; top: 1px;">
                <img style="height: 22px; position: relative;bottom: 1px;right: 5px;" src="img/nav01.png">所有分类
            </a>
            <div id="dropdown_menu_sec" class="dropdown-menu" aria-labelledby="dropdownMenuLink">
                <a onMouseOver="show2()" onMouseOut="hiden2()" class="dropdown-item" href="#"><img class="act"
                        style="height: 22px; position: relative;bottom: 1px;right: 5px;"
                        src="img/nav02.png">美容彩妆<img class="act"
                        style="height: 15px; position: relative; bottom: 1px; left: 12px;" src="img/turn_r.png"></a>
                <a onMouseOver="show3()" onMouseOut="hiden3()" class="dropdown-item" href="#"><img class="act"
                        style="height: 22px; position: relative;bottom: 1px;right: 5px;"
                        src="img/nav03.png">母婴儿童<img class="act"
                        style="height: 15px; position: relative; bottom: 1px; left: 12px;" src="img/turn_r.png"></a>
                <a onMouseOver="show4()" onMouseOut="hiden4()" class="dropdown-item" href="#"><img class="act"
                        style="height: 22px; position: relative;bottom: 1px;right: 5px;"
                        src="img/nav04.png">营养保健<img class="act"
                        style="height: 15px; position: relative; bottom: 1px; left: 12px;" src="img/turn_r.png"></a>
                <a onMouseOver="show5()" onMouseOut="hiden5()" class="dropdown-item" href="#"><img class="act"
                        style="height: 22px; position: relative;bottom: 1px;right: 5px;"
                        src="img/nav05.png">数码家电<img class="act"
                        style="height: 15px; position: relative; bottom: 1px; left: 12px;" src="img/turn_r.png"></a>
                <a onMouseOver="show6()" onMouseOut="hiden6()" class="dropdown-item" href="#"><img class="act"
                        style="height: 22px; position: relative;bottom: 1px;right: 5px;"
                        src="img/nav06.png">个护家清<img class="act"
                        style="height: 15px; position: relative; bottom: 1px; left: 12px;" src="img/turn_r.png"></a>
                <a onMouseOver="show7()" onMouseOut="hiden7()" class="dropdown-item" href="#"><img class="act"
                        style="height: 22px; position: relative;bottom: 1px;right: 5px;"
                        src="img/nav07.png">服饰鞋靴<img class="act"
                        style="height: 15px; position: relative; bottom: 1px; left: 12px;" src="img/turn_r.png"></a>
                <a onMouseOver="show8()" onMouseOut="hiden8()" class="dropdown-item" href="#"><img class="act"
                        style="height: 22px; position: relative;bottom: 1px;right: 5px;"
                        src="img/nav08.png">运动户外<img class="act"
                        style="height: 15px; position: relative; bottom: 1px; left: 12px;" src="img/turn_r.png"></a>
                <a onMouseOver="show9()" onMouseOut="hiden9()" class="dropdown-item" href="#"><img class="act"
                        style="height: 22px; position: relative;bottom: 1px;right: 5px;"
                        src="img/nav09.png">手表配饰<img class="act"
                        style="height: 15px; position: relative; bottom: 1px; left: 12px;" src="img/turn_r.png"></a>
                <a onMouseOver="show10()" onMouseOut="hiden10()" class="dropdown-item" href="#"><img class="act"
                        style="height: 22px; position: relative;bottom: 1px;right: 5px;"
                        src="img/nav10.png">环球美食<img class="act"
                        style="height: 15px; position: relative; bottom: 1px; left: 12px;" src="img/turn_r.png"></a>
            </div>
            <!-- 浮动盒子 -->
            <div class="box" id="box002" style="display: none;"><img style="height: 100%;" src="img/Snipaste_1.png">
            </div>
            <div class="box" id="box003" style="display: none;"><img style="height: 100%;" src="img/Snipaste_2.png">
            </div>
            <div class="box" id="box004" style="display: none;"><img style="height: 100%;" src="img/Snipaste_3.png">
            </div>
            <div class="box" id="box005" style="display: none;"><img style="height: 100%;" src="img/Snipaste_4.png">
            </div>
            <div class="box" id="box006" style="display: none;"><img style="height: 100%;" src="img/Snipaste_5.png">
            </div>
            <div class="box" id="box007" style="display: none;"><img style="height: 100%;" src="img/Snipaste_6.png">
            </div>
            <div class="box" id="box008" style="display: none;"><img style="height: 100%;" src="img/Snipaste_7.png">
            </div>
            <div class="box" id="box009" style="display: none;"><img style="height: 100%;" src="img/Snipaste_8.png">
            </div>
            <div class="box" id="box010" style="display: none;"><img style="height: 100%;" src="img/Snipaste_9.png">
            </div>
            <nav id="firstpage" class="nav" style="display: inline-block;">
               <a class="nav-link" href="./index.html">首页</a>
                <a class="nav-link" href="overseas.html">海外直购</a>
                <a class="nav-link" href="#">考拉海购出品</a>
                <a class="nav-link" href="#">品牌奶粉</a>
                <a class="nav-link" href="#">人气面膜</a>
                <a class="nav-link" href="invest.html">充值</a>
            </nav>
        </div>
    </div>
</div>


<!-- 中部信息 -->
<div class="recharge"  style="text-align: left;">
  <!-- 导航栏 ，点击跳转当界面的某个信息界面，通过其id号来进行追踪-->
    <nav>
        <div class="nav nav-tabs" id="nav-tab" role="tablist">
          <a class="nav-link active" id="nav-home-tab" data-toggle="tab" href="#nav-home" role="tab" aria-controls="nav-home" aria-selected="true" onclick="show02()">充话费</a>
          <a class="nav-link" id="nav-profile-tab" data-toggle="tab" href="#nav-profile" role="tab" aria-controls="nav-profile" aria-selected="false " onclick="show03()">充流量</a>
          <a class="nav-link" id="nav-contact-tab" data-toggle="tab" href="#nav-contact" role="tab" aria-controls="nav-contact" aria-selected="false" onclick="show04()">App Store充值卡</a>
        </div>
      </nav>
    
      <div class="m-telerecharge" id="nav-tabContent">
          <!-- 1.充话费界面信息 -->
          <div class="tab-pane fade show active" id="nav-home" role="tabpanel" aria-labelledby="nav-home-tab">
            <form action="#">
              <!-- 充值号码功能 -->
                <br><p>充值号码&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp; <input type="text" placeholder="请输入要充值的手机号码"></p>
                <!-- 充值面额功能 -->
                <div class="line amount" data-spm-anchor-id="a2v0d.b7356280.0.i1.2fb25732aNwYu6">
                    <span class="linetit">充值面额</span>
                    <ul class="linemsg">
                      <!--Regular list-->
                        <li class="z-act">
                          <span>10元</span>
                          <i><span class="icon-checked"></span></i>
                        </li>
                      
                        <li class="">
                          <span>20元</span>
                          <i><span class="icon-checked"></span></i>
                        </li>
                      
                        <li class="">
                          <span>30元</span>
                          <i><span class="icon-checked"></span></i>
                        </li>
                      
                        <li class="">
                          <span>50元</span>
                          <i><span class="icon-checked"></span></i>
                        </li>
                      
                        <li class="">
                          <span>100元</span>
                          <i><span class="icon-checked"></span></i>
                        </li>
                      
                        <li class="">
                          <span>200元</span>
                          <i><span class="icon-checked"></span></i>
                        </li>
                      
                        <li class="">
                          <span>300元</span>
                          <i><span class="icon-checked"></span></i>
                        </li>
                      
                        <li class="">
                          <span>500元</span>
                          <i><span class="icon-checked"></span></i>
                        </li>
                
                  </ul>
                  </div>
                  <!-- 销售价格 -->
                  <div class="line price">
                    <span class="linetit">销售价格</span><div class="linemsg">
                      <i>   &nbsp;&nbsp;&nbsp; &nbsp; &nbsp;&nbsp;&nbsp; &nbsp;10.00</i>元
                    </div>
                  </div>
                  <!-- 立即充值 -->
                  <form method="post" action="#">
                    <div class="line confirm">
                      <span class="linetit"></span><div class="linemsg">
                        <span class="btn f-vm" data-spm-anchor-id="a2v0d.b7356280.0.i3.447e5732PcD1Gw">
                          立即充值
                        </span>
                        <div class="msg">（确保输入正确的手机号，充错号将无法退款）</div>
                      </div>
                    </div>
                
                   
                  </form>
            </form>
          <!-- 常见问题 -->
            <div class="questions" >
              <div class="titw">
                <span class="tit">常见问题</span> <a class="more" target="_blank" href="#">更多问题&gt;</a>
                <u></u>
              </div>
                <h3>1 话费流量充值多久能到账？</h3>
                <p class="para">一般情况下，话费流量充值会在30分钟内到账，少数情况下以及充值高峰期，由于运营商或者网络原因，可能延迟24-48小时到账属于正常范围。</p>
                <h3>2 话费充值是否支持开发票？</h3>
                <p class="para">话费充值业务发票是由运营商提供，用户充值成功后，可到当地运营商营业厅打印上月的实际消费发票。因各运营商的规定不同，充值前请咨询当地营业厅关于发票获取的政策，或拨打运营商客服电话咨询，或拨打充值平台客服电话咨询。考拉海购平台目前的电信话费充值和移动联通部分地区话费充值为卡直充，运营商不提供话费充值发票，由考拉海购联系第三方商家提供定额发票（不保证提供对应运营商和地区的发票）。</p>
                <h3>3 考拉话费充值能参加运营商活动吗？</h3
                  ><p>考拉话费充值不保证能参加运营商活动，具体情况请仔细查阅运营商发布的活动说明。</p>
            </div>
        </div>

        <!-- 2.充流量界面 -->
        <div class="tab-pane fade" id="nav-profile" role="tabpanel" aria-labelledby="nav-profile-tab">
          <form action="#">
            <!-- 充值号码功能 -->
              <br><p>充值号码&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp; <input type="text" placeholder="请输入要充值的手机号码"></p>
              <!-- 充值面额功能 -->
              <div class="line amount">
                  <span class="linetit">充值面额</span>
                  <ul class="linemsg">
                    <!--Regular list-->
                      <li class="z-act">
                        <span>1G</span>
                        <i><span class="icon-checked"></span></i>
                      </li>
                    
                      <li class="">
                        <span>4G</span>
                        <i><span class="icon-checked"></span></i>
                      </li>
                </ul>
                </div>
                <!-- 流量价格 -->
                <div class="line price">
                  <span class="linetit">销售价格</span><div class="linemsg">
                    <i>   &nbsp;&nbsp;&nbsp; &nbsp; &nbsp;&nbsp;￥13.13-39.9</i>
                  </div>
                </div>
                <!-- 立即充值 -->
                <form method="post" action="#">
                  <div class="line confirm">
                    <span class="linetit"></span><div class="linemsg">
                      <span class="btn f-vm" data-spm-anchor-id="a2v0d.b7356280.0.i3.447e5732PcD1Gw">
                        立即充值
                      </span>
                      <div class="msg">（确保输入正确的手机号，充错号将无法退款）</div>
                    </div>
                  </div>
                </form>
          </form>
        <!-- 常见问题 -->
          <div class="questions" >
            <div class="titw">
              <span class="tit">常见问题</span> <a class="more" target="_blank" href="#">更多问题&gt;</a>
              <u></u>
            </div>
              <h3>1 话费流量充值多久能到账？</h3>
              <p class="para">一般情况下，话费流量充值会在30分钟内到账，少数情况下以及充值高峰期，由于运营商或者网络原因，可能延迟24-48小时到账属于正常范围。</p>
              <h3>2 话费充值是否支持开发票？</h3>
              <p class="para">话费充值业务发票是由运营商提供，用户充值成功后，可到当地运营商营业厅打印上月的实际消费发票。因各运营商的规定不同，充值前请咨询当地营业厅关于发票获取的政策，或拨打运营商客服电话咨询，或拨打充值平台客服电话咨询。考拉海购平台目前的电信话费充值和移动联通部分地区话费充值为卡直充，运营商不提供话费充值发票，由考拉海购联系第三方商家提供定额发票（不保证提供对应运营商和地区的发票）。</p>
              <h3>3 考拉话费充值能参加运营商活动吗？</h3
                ><p>考拉话费充值不保证能参加运营商活动，具体情况请仔细查阅运营商发布的活动说明。</p>
          </div>
        </div>


        <!-- 3.App Store充值卡 -->
  <div class="tab-pane fade" id="nav-contact" role="tabpanel" aria-labelledby="nav-contact-tab">
    <div class="line amount next" >
      <span class="linetit next">充值面额</span>
      <ul class="linemsg">
        <!--Regular list-->
          <li class="z-act">
            <span>50元</span>
            <i><span class="icon-checked"></span></i>
          </li>
        
          <li class="">
            <span>100元</span>
            <i><span class="icon-checked"></span></i>
          </li>
        
          <li class="">
            <span>200元</span>
            <i><span class="icon-checked"></span></i>
          </li>
        
          <li class="">
            <span>500元</span>
            <i><span class="icon-checked"></span></i>
          </li>
        
          <li class="">
            <span>1000元</span>
            <i><span class="icon-checked"></span></i>
          </li>
    </ul>
    </div>
     <!-- 价格 -->
     <div class="line price">
      <span class="linetit">销售价格</span><div class="linemsg">
        <i>   &nbsp;&nbsp;&nbsp; &nbsp; &nbsp;&nbsp;50元</i>
      </div>
    </div>
    <!-- 充值 -->
    <form method="post" action="#">
      <div class="line confirm">
        <span class="linetit"></span><div class="linemsg">
          <span class="btn f-vm" data-spm-anchor-id="a2v0d.b7356280.0.i3.447e5732PcD1Gw">
            立即充值
          </span>
          <div class="msg">（确保输入正确的手机号，充错号将无法退款）</div>
        </div>
      </div>
    </form>
</form>
    

    <!-- 常见问题 -->
    <div class="questions" >
      <div class="titw">
        <span class="tit">常见问题</span> <a class="more" target="_blank" href="#">更多问题&gt;</a>
        <u></u>
      </div>
        <h3>1 话费流量充值多久能到账？</h3>
        <p class="para">一般情况下，话费流量充值会在30分钟内到账，少数情况下以及充值高峰期，由于运营商或者网络原因，可能延迟24-48小时到账属于正常范围。</p>
        <h3>2 话费充值是否支持开发票？</h3>
        <p class="para">话费充值业务发票是由运营商提供，用户充值成功后，可到当地运营商营业厅打印上月的实际消费发票。因各运营商的规定不同，充值前请咨询当地营业厅关于发票获取的政策，或拨打运营商客服电话咨询，或拨打充值平台客服电话咨询。考拉海购平台目前的电信话费充值和移动联通部分地区话费充值为卡直充，运营商不提供话费充值发票，由考拉海购联系第三方商家提供定额发票（不保证提供对应运营商和地区的发票）。</p>
        <h3>3 考拉话费充值能参加运营商活动吗？</h3
          ><p>考拉话费充值不保证能参加运营商活动，具体情况请仔细查阅运营商发布的活动说明。</p>
    </div>
  </div>
      </div>
</div>

<div class="car_bottom">
  <!--底部导航-->
  <div class="bottom_nav" id="te">
      <div>
          <img class="bottom_img" src="img/car/bottom_nav.png">
      </div>
      <div class="bottom_text">
          <ul class="clearfix">
              <li class="first">
                  <img class="bottom_kaola" src="img/car/kaola.png">
                  <div class="focuson">
                      <span class="label">关注我们</span>
                      <img class="weibo" src="img/car/weibo.png">
                      <img class="wechat" src="img/car/wechat.png">
                  </div>
              </li>
              <li class="tex">
                  <dl>
                      <dt>
                          <em>
                              考拉保障
                          </em>
                      </dt>
                      <dd>假一赔十</dd>
                      <dd>廉正举报</dd>
                  </dl>
              </li>
              <li class="tex">
                  <dl>
                      <dt>
                          <em>
                              新手指南
                          </em>
                      </dt>
                      <dd>购物流程</dd>
                      <dd>支付方式</dd>
                      <dd>通关税费</dd>
                      <dd>常见问题</dd>
                  </dl>
              </li>
              <li class="tex">
                  <dl>
                      <dt>
                          <em>
                              售后服务
                          </em>
                      </dt>
                      <dd>售后政策</dd>
                      <dd>退货流程</dd>
                      <dd>特色服务</dd>
                      <dd>联系客服</dd>
                  </dl>
              </li>
              <li class="tex">
                  <dl>
                      <dt>
                          <em>
                              物流配送
                          </em>
                      </dt>
                      <dd>配送方式</dd>
                      <dd>配送服务</dd>
                      <dd>运费标准</dd>
                      <dd>物流跟踪</dd>
                  </dl>
              </li>
              <li class="tex">
                  <dl>
                      <dt>
                          <em>
                              商家服务
                          </em>
                      </dt>
                      <dd>招商合作</dd>
                      <dd>销售联盟</dd>
                      <dd>商家成长</dd>
                  </dl>
              </li>
              <li class="tex">
                  <dl>
                      <dt>
                          <em>
                              关于我们
                          </em>
                      </dt>
                      <dd>联系我们</dd>
                      <dd>CEO邮箱</dd>
                  </dl>
              </li>
              <li class="last">
                  <img src="img/car/QRcode.png">
                  <span>扫描下载手机版</span>
              </li>
          </ul>
      </div>
  </div>
  <!-- 底部 -->
  <div class="foot">
      <div id="scrif">
          <span class="remark">增值电信业务经营许可证：浙B2-20160288</span>
          <span class="remark">（浙）网械平台备字[2018]第00007号</span>
          <span class="remark">阿里巴巴版权所有C2003-2021</span>
          <a style="margin-left: 20px;" href="https://you.kaola.com/common/page.html?key=Privacy_policy"
              rel="nofollow" target="_blank" title="隐私政策" _pi="1">隐私政策</a>
          <span class="sep">- </span>
          <a href="https://www.kaola.com/" target="_blank" title="考拉海购" data-param="zn=footer">考拉海购</a>
          <br>
          <span class="remark">网络文化经营许可证：浙网文（2020）4340-180号</span>
          <span class="remark">浙江省网络食品销售第三方平台提供者备案：浙网食A33010006</span>
          <a target="_blank"
              href="https://kaola-haitao.oss.kaolacdn.com/6df8bb71-a013-41d4-8491-548215da176d.png">
              <span style="margin: 0px 0px 0px 20px;">网络第三方平台规范进口冷链食品承诺函</span>
          </a>
          <br>
          <a href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=33010802002216&no_protofix"><img
                  src="./img/bottom_photo/警徽.png" id="police"></a>
          <a target="_blank"
              href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=33010802002216&amp;no_protofix"><span
                  style="margin: 0px 0px 0px 5px;">
                  浙公网安备 33010802002216号</span>
          </a>
          <a href="javascript:void(0);" style="text-decoration: none; cursor: auto;">
              <span style="margin: 0px 0px 0px 20px;">互联网药品信息服务资格证书编号（浙）-2017-0027</span>
          </a>
          <a target="_blank" href="http://beian.miit.gov.cn">
              <span style="margin: 0px 0px 0px 20px;">浙ICP备16011229号-6</span>
          </a>
          <span class="remark">
              <a href="//pages.kaola.com/pages/activity/Businessentity.shtml" rel="nofollow" target="_blank"
                  title="自营经营者信息">自营经营者信息</a>
          </span>
          <div class="bottombarest">
              <img src="./img./bottom_photo/可信网站.png" alt="可信网站" _pi="1">
              <img src="./img/bottom_photo/电子营业执照.png">
          </div>
      </div>
  </div>
</div>

</body>
</html>